<template>
    <div class="ProcessAdvice6">
        <div class="shareHeadClass">
            <p class="colCLas"></p>
            <p class="info">红字确认单确认内容</p>
        </div>
        <el-form
            :model="vmsApprovalHzqrdSimpleVo"
            :rules="isLook ? {} : rules"
            label-width="140px"
            class="formInline"
            size="small"
            ref="hzqrdsqRef"
            :disabled="isLook"
        >
            <el-row>
                <el-col :span="8"  >
                    <el-form-item label="发票代码：" >
                        <el-input
                            v-model="vmsApprovalHzqrdSimpleVo.lzfpdm"
                            maxlength="20"
                            placeholder="请输入发票代码"
                            @input="handleInput1"
                        ></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8"  >
                    <el-form-item label="发票号码：" prop="lzfphm" >
                        <el-input
                            v-model="vmsApprovalHzqrdSimpleVo.lzfphm"
                            maxlength="20"
                            placeholder="请输入发票号码"
                            @input="handleInput2"
                        ></el-input>
                    </el-form-item>
                </el-col>
                <!-- <el-col :span="11">
                    <el-form-item label="蓝字发票号码：" prop="lzfphm">
                        <el-input
                        style="min-width: 170px;"
                            v-model="vmsApprovalHzqrdSimpleVo.lzfphm"
                            maxlength="20"
                        ></el-input>
                    </el-form-item>
                </el-col> -->

                <el-button
                    v-if="!isLook"
                    type="primary"
                    size="small"
                    style="margin-left: 8px"
                    @click="quickAdd"
                >
                    快速添加
                </el-button>
                <el-button
                    v-if="!isLook"
                    type="primary"
                    size="small"
                    @click="search"
                >
                    蓝字发票查询
                </el-button>
                <el-button v-if="!isLook" size="small" @click="research">重置</el-button>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item prop="lrfsf" label="申请方角色：">
                        <el-select
                            v-model="vmsApprovalHzqrdSimpleVo.lrfsf"
                            placeholder="请选择"
                            style="width: 100%"
                            :disabled="true"
                        >
                            <el-option
                                v-for="item in [
                                    { label: '购方', value: '1' },
                                    { label: '销方', value: '0' },
                                ]"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="红冲原因：" prop="chyydm">
                        <el-select
                            :disabled="!vmsApprovalHzqrdSimpleVo.chlx"
                            v-model="vmsApprovalHzqrdSimpleVo.chyydm"
                            placeholder="请选择"
                            style="width: 100%"
                            @change="clearValid"
                        >
 
                            <el-option
                                v-for="item in [
                                    { label: '开票有误', value: '01' },
                                    { label: '销货退回', value: '02' },
                                    { label: '服务中止', value: '03' },
                                    { label: '销售折让', value: '04' },
                                ]"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="红冲类型：" prop="chlx">
                        <el-select
                            v-model="vmsApprovalHzqrdSimpleVo.chlx"
                            :disabled="vmsApprovalHzqrdSimpleVo.chyydm == '01'"
                            style="width: 100%"
                            placeholder="请选择"
                        >
                            <el-option
                                v-for="item in vmsApprovalHzqrdSimpleVo.chlxSelect"
                                :key="item.lxxdm"
                                :label="item.lxxmc"
                                :value="item.lxxdm"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="购买方是否抵扣：" prop="gmfsfdkrz">
                        <el-select
                            v-model="vmsApprovalHzqrdSimpleVo.gmfsfdkrz"
                            placeholder="请选择"
                            :disabled="true"
                            style="width: 100%"
                        >
                        <el-option
                                v-for="item in [
                                    { label: '是', value: 'Y' },
                                    { label: '否', value: 'N' },
                                ]"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="是否纸质发票：" prop="sfzzfpbz">
                        <el-select
                            :disabled="vmsApprovalHzqrdSimpleVo.sfzzfpSelect&& (vmsApprovalHzqrdSimpleVo.sfzzfpSelect.length <= 1)"
                            v-model="vmsApprovalHzqrdSimpleVo.sfzzfpbz"
                            placeholder="请选择"
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in vmsApprovalHzqrdSimpleVo.sfzzfpSelect"
                                :key="item.lxxdm"
                                :label="item.lxxmc"
                                :value="item.lxxdm"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="24">
                    <el-form-item label="购买方未抵扣原因：" >
                        <el-input
                            type="textarea"
                            v-model="vmsApprovalHzqrdSimpleVo.gmfwdkyy"
                            maxlength="500"
                            show-word-limit
                            :rows="7"
                        ></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item
                label="红冲发票明细："
                prop="vmsApprovalHzqrdItemVoList"
            >
            <tableList 
                    border
                    maxHeight="300"
                    :keySet="keySet"
                    :autoHeight="true"
                    :tableData="vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList"
                    @rowDblclick="rowDblclick"
                    handlerFixed="right"
                    :handlerShow="true"
                    >
                    <template #cxsl="{ row }">
                            <span>{{ row.cxsl }}</span>
                        </template>
                        <template #cxje="{ row }">
                            <span>{{ row.cxje }}</span>
                        </template>
                        <template #cxse="{ row }">
                            <span>{{ row.cxse }}</span>
                        </template>
                        <template #handler="{ row }">
                            <div v-show="vmsApprovalHzqrdSimpleVo.chlx == '7' && (vmsApprovalHzqrdSimpleVo.chyydm)" @click="del(row)" class="worldBlueBtn">删除</div>
                            <div v-show="vmsApprovalHzqrdSimpleVo.chlx == '7' && (vmsApprovalHzqrdSimpleVo.chyydm)" @click="rowDblclick(row)" class="worldBlueBtn">编辑</div>
                        </template>
            </tableList>
            </el-form-item>

        </el-form>

        <writeOffInvoice v-model="writeOff" :dbRow="dbRow" @writeCb="writeCb"></writeOffInvoice>

        <searchDialog
            v-model="searchDialogShow"
            @searchCb="searchCb"
        ></searchDialog>
    </div>
</template>

<script>
import tableList from '@/components/tableList/index.vue'
import mixinTable from '@/mixin/mtable.js'
import writeOffInvoice from './components/writeOffInvoice.vue'
import searchDialog from './components/searchDialog.vue'
import { fastAdd, getApplyDetail } from '@/api/vmsHzqrdApply.js'

export default {
    name: 'redInvoiceApply7',
    props: {
        invoiceCategory: {
            type: String,
            default: '',
        },
        flag: {
            type: String,
            // default:''
        },
        isLook: {
            type: Boolean,
            default: false,
        },
    },
    data() {
        return {
            activeComNumber: -1,
            vmsApprovalHzqrdSimpleVo: {
                lzfpdm: '', //
                lzfphm: '', //
                lrfsf: '0',
                sfzzfpbz:'',
                sfzzfpSelect: [
                    {
                        lxxmc: '否',
                        lxxdm: 'N',
                    },
                ],
                chlx: '8',
                chyydm:'01',
                gmfsfdkrzrz: 'N',
                chlxSelect: [
                    {
                        "lxxmc": "全额红冲",
                        "lxxdm": "8"
                    }
                ],
                gmfwdkyy:'',
                vmsApprovalHzqrdItemVoList: [],
            },


            activeComNumber: -1,
            rules: {
                lzfphm: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                // lzfphm: [
                //     {
                //         required: true,
                //         message: '请输入',
                //         trigger: 'change',
                //     },
                // ],
                xfmc: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                xfnsrsbh: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'change',
                    },
                ],
                gfmc: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'change',
                    },
                ],
                gfnsrsbh: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                lrfsf: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                chyydm: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'blur',
                    },
                ],
                chlx: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'blur',
                    },
                ],
                gmfsfdkrz: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                gmfwdkyy: [
                    {
                        required: true,
                        message: '请输入',
                        trigger: 'change',
                    },
                ],
                sfzzfpbz: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'change',
                    },
                ],
                vmsApprovalHzqrdItemVoList: [
                    {
                        required: true,
                        message: '请选择',
                        trigger: 'change',
                    },
                ],
            },

            keySet: [
                {
                    label: '项目名称',
                    englishName: 'xmmc',
                    width: 200
                },
                {
                    label: '规格型号',
                    englishName: 'ggxh', 
                },
                {
                    label: '单位',
                    englishName: 'dw', 
                },
                {
                    label: '数量',
                    englishName: 'sl', 
                },
                {
                    label: '单价',
                    englishName: 'dj', 
                },
                {
                    label: '金额',
                    englishName: 'je', 
                },
                {
                    label: '税率',
                    englishName: 'slv', 
                },
                {
                    label: '税额',
                    englishName: 'se', 
                },
                {
                    label: '可冲销数量',
                    englishName: 'kcxsl', 
                },
                {
                    label: '可冲销金额',
                    englishName: 'kcxje', 
                },
                {
                    label: '可冲销税额',
                    englishName: 'kcxse', 
                },
                {
                    label: '冲销数量',
                    englishName: 'cxsl',
                    isSlot: true,
                    slotName: 'cxsl',
                },
                {
                    label: '冲销金额',
                    englishName: 'cxje',
                    isSlot: true,
                    slotName: 'cxje',
                },
                {
                    label: '冲销税额',
                    englishName: 'cxse',
                    isSlot: true,
                    slotName: 'cxse',
                },
            ],

            writeOff: false,
            searchDialogShow: false,

            dbRow: null,
        }
    },
    created() {
        this.getDetail()
    },
    watch:{
        'vmsApprovalHzqrdSimpleVo.chyydm'(newV){
            if(newV == '01')this.vmsApprovalHzqrdSimpleVo.chlx = '8'
        },
        'vmsApprovalHzqrdSimpleVo.chlx'(newV){
            if(newV == '8'){
                if(this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList&& this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList.length){
                    this.$set(this.vmsApprovalHzqrdSimpleVo,'vmsApprovalHzqrdItemVoList',
                    this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList.map(item=>{
                        return {...item, ...{
                            cxje : item.kcxje,
                            cxse : item.kcxse,
                            cxsl : item.kcxsl
                        }}
                    })
                    )
                }
            }
        },
    },
    methods: {
        handleInput1(val) {
            // 使用正则表达式去除非数字字符
            this.vmsApprovalHzqrdSimpleVo.lzfpdm = val.replace(/\D/g, '');
            if (this.vmsApprovalHzqrdSimpleVo.lzfpdm.length > 12) {
                this.vmsApprovalHzqrdSimpleVo.lzfpdm = this.vmsApprovalHzqrdSimpleVo.lzfpdm.slice(0, 12);
            }
        },
        handleInput2(val) {
            this.vmsApprovalHzqrdSimpleVo.lzfphm = val.replace(/\D/g, '');
            if (this.vmsApprovalHzqrdSimpleVo.lzfphm.length > 20) {
                this.vmsApprovalHzqrdSimpleVo.lzfphm = this.vmsApprovalHzqrdSimpleVo.lzfphm.slice(0, 20);
            }
        },
        writeCb(row){
            this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList.forEach((item,index)=>{
                if(item.id == row.id){
                    this.$set(this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList,index,row)
                }
            })
        },
        del(row) {
            this.$confirm( `确定删除吗？`,'确认').then(data=>{
                this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList = this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList.filter(item=>{
                    return item.id != row.id;
                })

                },err=>{
                })
        },
        getDetail(){ 
            let obj = JSON.parse(
                sessionStorage.getItem('handleDetailInfo')
            )
            getApplyDetail({
                applyId: obj.busId
            }).then(({data,code})=>{
                if(code ==200){
                    this.vmsApprovalHzqrdSimpleVo = {
                        ...this.vmsApprovalHzqrdSimpleVo,
                        ...data.vmsApprovalHzqrdSimpleVo,
                        vmsApprovalHzqrdItemVoList:data.vmsApprovalHzqrdItemVoList,
                        lzfpdm:  data.vmsApprovalHzqrdSimpleVo.lzfpdm || '',
                        lzfphm:  data.vmsApprovalHzqrdSimpleVo.lzfphm || '',
                    };
                }
            })
        },
        quickAdd(){ 
            if(this.vmsApprovalHzqrdSimpleVo.lzfphm.length <20 && !this.vmsApprovalHzqrdSimpleVo.lzfpdm){
               return this.$message.error('发票号码不足20位，发票代码不得为空！')
            }
            
            let params = new URLSearchParams('');
            params.append("lzfphm", this.vmsApprovalHzqrdSimpleVo.lzfphm);
            params.append("lzfpdm", this.vmsApprovalHzqrdSimpleVo.lzfpdm);
            params.append("applyId", this.$store.state.invoice2.invoinceFormStart1.busId);
            fastAdd(params).then(({data,code})=>{
                if(code ==200){
                    this.vmsApprovalHzqrdSimpleVo = {
                        ...this.vmsApprovalHzqrdSimpleVo,
                        ...data.vmsApprovalHzqrdSimpleVo,
                        lzfpdm: data.vmsApprovalHzqrdSimpleVo.lzfpdm || '',
                        lzfphm: data.vmsApprovalHzqrdSimpleVo.lzfphm || '',
                    };
                    this.vmsApprovalHzqrdSimpleVo.vmsApprovalHzqrdItemVoList = data.vmsApprovalHzqrdItemVoList;

                    setTimeout(()=>{
                        this.$refs.hzqrdsqRef.clearValidate()
                    },20)
                }
            })
        },
        clearValid(){
            setTimeout(()=>{
                        this.$refs.hzqrdsqRef.clearValidate()
                    },20)
        },
        research(){
            this.vmsApprovalHzqrdSimpleVo.lzfphm = ''
            this.vmsApprovalHzqrdSimpleVo.lzfpdm = ''
        },
        searchCb(obj) {
            this.searchDialogShow = obj.show;
            if(obj.row&&obj.row.lzfphm){
                this.vmsApprovalHzqrdSimpleVo.lzfphm = obj.row.lzfphm;
                this.quickAdd()
            }

        },
        search() {
            this.searchDialogShow = true;
            
        },
        rowDblclick(val2) {
            if(this.vmsApprovalHzqrdSimpleVo.chlx == '7'){
                this.dbRow = {...val2};
                this.dbRow.chyydm = this.vmsApprovalHzqrdSimpleVo.chyydm;
                this.dbRow.cxsl = this.dbRow.cxsl? this.dbRow.cxsl : undefined;
                this.writeOff = true
            }
        },
    },
    mixins: [mixinTable],
    components: {
        tableList,
        writeOffInvoice,
        searchDialog,
    },
}
</script>

<style lang = "scss" scoped>
::v-deep .vxe-modal--wrapper .vxe-modal--content {
    white-space: none;
}
</style>
